<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page import="MyServlet.Candidate2"%>
<%@ page import="MyServlet.Position2"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
	<link type="text/css" href="css/menu.css" rel="stylesheet" />
<link type="text/css" href="css/jquery-ui-1.10.0.custom.min.css" rel="stylesheet" />
<link type="text/css" href="css/menu.css" rel="stylesheet" />
<link type="text/css" href="css/popup.css" rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.10.0.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.leanModal.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

<script>
	  $(function() {
	    $( "#tabs" ).tabs();
	  });
</script>

<script type="text/javascript">
$(function(){
  $('#loginform').submit(function(e){
    return false;
  });
});
</script>

</head>
<body>

<div id="tabs">
  <ul>
  	<li><a href="#tabs-1">Users</a></li>
    <li><a href="#tabs-2">Positions</a></li>
    <li><a href="#tabs-3">Candidates</a></li>
    <li><a href="#tabs-4">Approve positions</a></li>
  </ul>
  <div id="tabs-1">
  <div id="myDiv2">
  		
  		<a style="float:left;" href="#loginmodal3" class="flatbtn" id="modaltrigger3"><button>+</button></a>

		<div id="loginmodal3" class="popupMany" style="display:none;">
		  <h1>Add User</h1>
		  <form id="loginform" name="loginform" method="post" action="index.html">
		    <label for="username">Firstname:</label>
		    <input type="text" name="firstname" id="firstname" class="txtfield" tabindex="1">
		     
		    <label for="password">Lastname:</label>
		    <input type="password" name="lastname" id="lastname" class="txtfield" tabindex="2">
		    
		    <label for="password">Lastname:</label>
		    <input type="password" name="lastname" id="lastname" class="txtfield" tabindex="3">
		    
		    <label for="password">Lastname:</label>
		    <input type="password" name="lastname" id="lastname" class="txtfield" tabindex="4">
		    
		    <label for="password">Lastname:</label>
		    <input type="password" name="lastname" id="lastname" class="txtfield" tabindex="5">
		     
		    <div class="center"><input type="submit" name="loginbtn" id="loginbtn" class="flatbtn-blu hidemodal" value="Log In" tabindex="3"></div>
		  </form>
		</div>
		
		<br><br>
  	
		<c:if test="${!empty userList }">
			<c:forEach items="${userList}" var="user">
				<div>
				<form action="/Assignment3/updateUser/${user.id}"  method="POST">
					<table style="border-bottom-style: solid;">
					<tr>
						<td><a href="/Assignment3/deleteUser/${user.id}"><button> Delete </a></button> </td>
						<td>
							<table>
							<tr><td>Name: ${user.name}</td></tr>
							<tr><td>Password: ${user.password}</td></tr>
							<tr><td>Type: ${user.type}</td></tr>
						
							</table>
						</td>
						<td><img src="images/user.jpg" height="150" width="250"></td>
						<td>
							<table>
							<tr><td>Name:</td><td><input class="inputtext" type="text" name="name"/></td></tr>
							<tr><td>Password:</td><td>  <input class="inputtext" type="text" name="password"/></td></tr>
							<tr><td>Type:</td><td>   <input class="inputtext" type="text" name="type"/></td></tr>
						
							</table>
							
						</td>
						<td><input type="submit" tabindex="4" value="Update"/></td>
					</tr>
					</table>
					</form>
				</div>
			</c:forEach>
		</c:if>
		</div>
		</div>
  <div id="tabs-2">
  	<div id="myDiv2">
  		<a style= "float:left;" href="#loginmodal" class="flatbtn" id="modaltrigger"><button>+</button></a>

		<div id="loginmodal" style="display:none;">
		  <h1>User Login</h1>
		  <form id="loginform" name="loginform" method="post" action="index.html">
		    <label for="username">Username:</label>
		    <input type="text" name="username" id="username" class="txtfield" tabindex="1">
		     
		    <label for="password">Password:</label>
		    <input type="password" name="password" id="password" class="txtfield" tabindex="2">
		     
		    <div class="center"><input type="submit" name="loginbtn" id="loginbtn" class="flatbtn-blu hidemodal" value="Log In" tabindex="3"></div>
		  </form>
		</div>
		<br><br>
		
		<c:if test="${!empty positionList }">
			<c:forEach items="${positionList}" var="position">
				<div>
					<form action="/Assignment3/updateUser/${position.id}" method="POST">
						<table style="border-bottom-style: solid;">
							<tr>
								<td>
									<a href="/Assignment3/deleteUser/${position.id}"><button>Delete</button></a></td>
								<td>
									<table>
										<tr>
											<td>Total places: ${position.totalPlaces}</td>
										</tr>
										<tr>
											<td>Name: ${position.name}</td>
										</tr>
										<tr>
											<td>Project: ${position.project}</td>
										</tr>
										<tr>
											<td>Requirements: ${position.requirements}</td>
										</tr>

									</table>
								</td>
								<td><img src="images/user.jpg" height="150" width="250"></td>
								<td>
									<table>
										<tr>
											<td>Total places:</td>
											<td><input class="inputtext" type="text" name="totalPlaces" /></td>
										</tr>
										<tr>
											<td>Name:</td>
											<td><input class="inputtext" type="text" name="name" /></td>
										</tr>
										<tr>
											<td>Project:</td>
											<td><input class="inputtext" type="text" name="project" /></td>
										</tr>
										<tr>
											<td>Requirements:</td>
											<td><input class="inputtext" type="text" name="requirements" /></td>
										</tr>

									</table>

								</td>
								<td><input type="submit" tabindex="4" value="Update" /></td>
							</tr>
						</table>
					</form>
				</div>
			</c:forEach>
		</c:if>
	</div>
  </div>
  <div id="tabs-3">
 	 <div id="myDiv2">
		<a style="float:left;" href="#loginmodal2" class="flatbtn" id="modaltrigger2"><button>+</button></a>

		<div id="loginmodal2" class="popupMany" style="display:none;">
		  <h1>User Login</h1>
		  <form id="loginform" name="loginform" method="post" action="index.html">
		    <label for="username">qwee:</label>
		    <input type="text" name="username" id="username" class="txtfield" tabindex="1">
		     
		    <label for="password">sadd:</label>
		    <input type="password" name="password" id="password" class="txtfield" tabindex="2">
		     
		    <div class="center"><input type="submit" name="loginbtn" id="loginbtn" class="flatbtn-blu hidemodal" value="Log In" tabindex="3"></div>
		  </form>
		</div>
		
		<br><br>
		<c:if test="${!empty candidateList }">
			<c:forEach items="${candidateList}" var="candidate">
				<div >
				<form action="/Assignment3/updatecandidate/${candidate.id}"  method="POST">
					<table style="border-bottom-style: solid;">
					<tr>
						<td>
							<a href="/Assignment3/deletecandidate/${candidate.id}"><button> Delete </button></a></td>
						<td>
							<table>
							<tr><td>First name: ${candidate.firstName}</td></tr>
							<tr><td>Last name: ${candidate.lastName}</td></tr>
							<tr><td>Email: ${candidate.email}</td></tr>
							<tr><td>Mobile: ${candidate.mobileNo}</td></tr>
							<tr><td>Telephone: ${candidate.telephoneNo}</td></tr>
							<tr><td>Interview: ${candidate.interviews}</td></tr>
							<tr><td>Comments: ${candidate.comments}</td></tr>
							
							</table>
						</td>
						<td><img src="images/user.jpg" height="150" width="250"></td>
						<td>
							<table>
				
							<tr><td>First name: ${candidate.firstName}</td><td><input class="inputtext" type="text" name="firstname"/></td></tr>
							<tr><td>Last name: ${candidate.lastName}</td><td><input class="inputtext" type="text" name="lastname"/></td></tr>
							<tr><td>Email: ${candidate.email}</td><td><input class="inputtext" type="text" name="email"/></td></tr>
							<tr><td>Mobile: ${candidate.mobileNo}</td><td><input class="inputtext" type="text" name="mobileno"/></td></tr>
							<tr><td>Telephone: ${candidate.telephoneNo}</td><td><input class="inputtext" type="text" name="telephone"/></td></tr>
							<tr><td>Interview: ${candidate.interviews}</td><td><input class="inputtext" type="text" name="interview"/></td></tr>
							<tr><td>Comments: ${candidate.comments}</td><td><input class="inputtext" type="text" name="comments"/></td></tr>
							</table>
							
						</td>
						<td><input type="submit" tabindex="4" value="Update"/></td>
					</tr>
					</table>
					</form>
				</div>
			</c:forEach>
		</c:if>
		</div>
  </div>
  <div id="tabs-4">
  	<p>Positions</p>
  </div>
</div>

</body>
</html>